<html>

<head>
    <meta charset="utf-8">
    <title>收支明细</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <!--标准mui.css-->
    <link rel="stylesheet" href="../default/css/mui.min.css">
    <link rel="stylesheet" type="text/css" href="../default/css/index.css"/>
    <!--App自定义的css-->
    <style type="text/css">
        p img {
            max-width: 100%;
            height: auto;
        }

        .mui-content {
            background: #fff;
        }

        .mui-bar-nav ~ .mui-content {
            padding-bottom: 50px;
        }

        .mui-bar-nav.mui-bar .mui-pull-right span {
            color: #8f8f94;
        }

        .mui-segmented-control.mui-segmented-control-inverted .mui-control-item.mui-active {
            color: #000;
            border-bottom: 2px solid #ffdb28;
        }

        .mui-table-view-cell:after {
            height: 0;
        }

        .mui-table-view-cell .mui-row div {
            color: #8f8f94;
            font-size: 13px;
        }

        .mui-table-view .mui-media-object.mui-pull-left {
            font-size: 40px;
            color: #ffdb28;
        }

        .mui-content{
            background: #EFEFF4;
        }

        #sliderSegmentedControl a{
            background: white;
        }
        .top-shadow{
            height: 0;
        }

    </style>

</head>

<body>
<header class="mui-bar mui-bar-nav">
    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
    <h1 class="mui-title">收支明细</h1>
    <!--<a class="'mui-btn mui-btn-link mui-pull-right" href="wirecord.html"><span>提现记录</span></a>-->
</header>
<div class="mui-content">
    <!-- https://srhub.oss-cn-hangzhou.aliyuncs.com/zq-news/images/wallet-bang.jpg -->
    <!--<div class="mui-card card-wet-cent">-->
        <!--<div class="mui-table">-->
            <!--&lt;!&ndash;<div class="mui-col-xs-8 mui-col-sm-8 mui-inline">-->
                <!--<p>累计收入</p>-->
                <!--<h4 id="all-income">-&#45;&#45;</h4>-->
            <!--</div>&ndash;&gt;-->
            <!--&lt;!&ndash;<div class="mui-col-xs-4 mui-col-sm-4 mui-inline">-->
                   <!--<button type="button" class="mui-btn mui-btn-danger">阅读宝兑换</button>-->
               <!--</div>&ndash;&gt;-->
        <!--</div>-->
        <!--<div class="mui-table">-->
            <!--<div class="mui-col-xs-4 mui-col-sm-4 mui-inline">-->
                <!--<p>佣金</p>-->
                <!--<strong>-->
                    <!--<h4 id="commission">&#45;&#45;</h4>-->
                <!--</strong>-->
            <!--</div>-->
            <!--<div class="mui-col-xs-4 mui-col-sm-4 mui-inline">-->
                <!--<p>阅读宝余额</p>-->
                <!--<strong>-->
                    <!--<h4 id="balance">&#45;&#45;</h4>-->
                <!--</strong>-->
            <!--</div>-->
            <!--<div class="mui-col-xs-4 mui-col-sm-4 mui-inline">-->
                <!--<p>本月直推人数</p>-->
                <!--<strong>-->
                    <!--<h4 id="withdrawalLimit">&#45;&#45;</h4>-->
                <!--</strong>-->
            <!--</div>-->
            <!--&lt;!&ndash;<div class="mui-col-xs-12 mui-col-sm-12 mui-inline">-->
                <!--<button class=""></button>-->
            <!--</div>&ndash;&gt;-->
        <!--</div>-->
    <!--</div>-->
    <!--<div class="mui-table tagging-information">-->
        <!--<div class="mui-col-xs-8 mui-col-sm-8 mui-inline">-->
            <!--&lt;!&ndash;<p>1阅读宝等于1元</p>&ndash;&gt;-->
        <!--</div>-->
        <!--<div class="mui-col-xs-4 mui-col-sm-4 mui-inline">-->
            <!--&lt;!&ndash;	<a href="exchange-rules.html">-->
                        <!--<p><i class="mui-icon mui-icon-help"></i>兑换规则</p>-->
                    <!--</a>&ndash;&gt;-->
        <!--</div>-->
    <!--</div>-->
    <!-- 假装是布局 -->
    <div class="top-shadow"></div>

    <div id="sliderSegmentedControl" class="mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
        <a class="mui-control-item mui-active" href="#item2">
            商城分销明细
        </a>
        <!--<a class="mui-control-item mui-active" href="#item1">-->
            <!--分销明细-->
        <!--</a>-->
    </div>
    <div class="mui-slider-group">
        <div id="item2" class="mui-control-content">
            <div class="test" id="sollr2">
                <ul class="mui-table-view" id="read">

                </ul>
            </div>
        </div>
        <!--<div id="item1" class="mui-control-content mui-active">-->
            <!--<div class="test" id="sollr1">-->
                <!--<ul class="mui-table-view" id="distribution">-->

                <!--</ul>-->
            <!--</div>-->
        <!--</div>-->
    </div>

</div>
<!--<div class="cash-withdrawal-box">-->
    <!--<a href="upwallet.html">-->
        <!--<button type="button" class="mui-btn mui-btn-warning cash-withdrawal-btn">提现</button>-->
    <!--</a>-->
<!--</div>-->
</body>
<script src="../default/js/jquery-2.14.js" type="text/javascript" charset="utf-8"></script>
<script src="../default/js/mui.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../default/js/cookie.js"></script>
<script src="../default/js/code.js" type="text/javascript" charset="utf-8"></script>
<script src="../default/js/index.js" type="text/javascript" charset="utf-8"></script>
<script src="../default/js/public.js"></script>
<script src="../default/js/mui.pullToRefresh.js"></script>
<script src="../default/js/mui.pullToRefresh.material.js"></script>

<!--<script src="../default/js/vconsole.js"></script>-->
<script>
    mui.init({
        swipeBack: true //启用右滑关闭功能
    });
    // ajax地址

    mui.showLoading("正在加载..", "div");

    $(function () {
        findByUserBalance();
        queryQuota();
    });
    /*var lastPage = 3; //总共页数
    var currPage = 1; //当前页码
    var counter = 1; //计数器*/
    // 页码+50
    var startingNumber = 0;
    var startingNumber1 = 0;
    var index1 = 0;
    var index2 = 0;
    var frequency = 0;
    (function ($) {
        $.ready(function () {
            $.each(document.querySelectorAll('.mui-slider-group .test'), function (index, pullRefreshEl) {
                $(pullRefreshEl).pullToRefresh({
                    up: {
                        auto: true,
                        callback: function () {
                            var self = this;
                            createFragment(index, self);
                        }
                    }
                });
            });

            function createFragment(index, self) {

                if (frequency == 0) {
                    frequency = 1;
                    // distribution(self);
                    read(self);
                } else {
                    if (index == 0) {
                        startingNumber = startingNumber + 50;
                        // distribution(self);
                    } else if (index == 1) {
                        startingNumber1 = startingNumber1 + 50;
                        read(self);
                    }
                }
            };
        });
    })(mui);

    function queryUserTotalIncome() {
        $.ajax({
            url: website + '/UserController/queryUserTotalIncome',
            type: 'post',
            data: {userId: userId},
            success: function (data) {
                $("#all-income").html(data.data);
            }, error: function () {
                mui.showLoading("发生错误,返回首页..", "div");
                setTimeout(function () {
                    window.location.href = 'http://newst.whilte.com/index.html';
                }, 1000)
            }
        });
    }

    // function distribution(self) {
    //     mui.showLoading("正在加载..", "div");
    //     $.ajax({
    //         url: website + '/DistributionDetailsController/findByUserAll',
    //         type: 'post',
    //         data: {
    //             userId: userId,
    //             startingNumber: startingNumber
    //         },
    //         success: function (data) {
    //             var html = '';
    //             data.data.forEach(function (value) {
    //                 html += '<li class="mui-table-view-cell">\n' +
    //                     '<a href="javascript:;">\n';
    //                 if (value.severalLevelsOfDistribution == "一级分销") {
    //                     html += '<div class="mui-icon icon iconfont icon-yonghu1 mui-media-object mui-pull-left"></div>'
    //                 } else if (value.severalLevelsOfDistribution == "二级分销") {
    //                     html += '<div class="mui-icon icon iconfont icon-yonghu mui-media-object mui-pull-left"></div>'
    //                 } else {
    //                     html += '<div class="mui-icon icon iconfont icon-yonghu2 mui-media-object mui-pull-left"></div>'
    //                 }
    //                 html += '                                    <div class="mui-media-body">\n' +
    //                     value.severalLevelsOfDistribution +
    //                     '                                        <div class="mui-row">\n' +
    //                     '                                            <div class="mui-col-sm-6 mui-col-xs-6">\n' +
    //                     '                                              余额加' + value.rewardQuantity + '' +
    //                     '                                            </div>\n' +
    //                     '                                            <div class="mui-col-sm-6 mui-col-xs-6">\n' +
    //                     value.rewardTime +
    //                     '                                            </div>\n' +
    //                     '                                        </div>\n' +
    //                     '                                    </div>\n' +
    //                     '                                </a>\n' +
    //                     '</li>'
    //             });
    //
    //             mui.hideLoading();
    //             if (data.data.length == 0) {
    //                 self.endPullUpToRefresh(true);
    //             } else if (data.data.length < 50) {
    //                 $("#distribution").append(html);
    //                 self.endPullUpToRefresh(true);
    //             } else {
    //                 $("#distribution").append(html);
    //             }
    //             console.log(data);
    //         },
    //         error: function () {
    //             mui.showLoading("未知错误..", "div");
    //         }
    //     });
    // }

    function read(self) {
        mui.showLoading("正在加载..", "div");
        $.ajax({
            url: website + '/MallDistributionController/findByRewardMethod',
            type: 'post',
            data: {
                userId: userId,
                rewardMethod:1,
                pageNumber: startingNumber1
            },
            success: function (data) {
                var html = '';
                data.data.forEach(function (value) {
                    html += '<li class="mui-table-view-cell">\n' +
                        '<a href="javascript:;">\n';
                    // if (value.earningWay == "阅读文章奖励") {
                    //     html += '<div class="mui-icon icon iconfont icon-xinwen1 mui-media-object mui-pull-left"></div>'
                    // } else {
                    //     html += '<div class="mui-icon icon iconfont icon-chakantiezishipin mui-media-object mui-pull-left"></div>'
                    // }
                    html += '                                    <div class="mui-media-body">';
                    if(value.reward_method==1){
                        html+='<p>余额发放</p>';
                    }else{
                        html+='<p>阅读宝发放</p>';
                    }
                    html +=
                        '                                        <div class="mui-row">\n' +
                        '                                            <div class="mui-col-sm-6 mui-col-xs-6">\n' +
                        '                                              数量:￥' + value.reward_quantity +
                        '                                            </div>\n' +
                        '                                            <div class="mui-col-sm-6 mui-col-xs-6">\n' +
                        '时间:'+value.reward_time+
                        '                                            </div>\n' +
                        '                                        </div>\n' +
                        '                                    </div>\n' +
                        '                                </a>\n' +
                        '</li>'
                });
                mui.hideLoading();
                if (data.data.length == 0) {
                    self.endPullUpToRefresh(true);
                } else if (data.data.length < 50) {
                    $("#read").append(html);
                    self.endPullUpToRefresh(true);
                } else {
                    $("#read").append(html);
                }
            },
            error: function () {
                mui.showLoading("未知错误..", "div");
            }

        });
    }

    // 查询用户的分销佣金和阅读宝,和朋友
    function findByUserBalance() {
        // 查询用户的阅读宝和余额
        mui.showLoading("正在加载..", "div");
        $.ajax({
            url: website + '/UserController/findByUserBalance',
            type: 'post',
            data: {userId: userId},
            success: function (data) {
                // console.log(data);
                $("#balance").html(data.data.balance);
                $("#commission").html(data.data.commission);
                mui.hideLoading();
            },
            error: function () {
                mui.showLoading("未知错误..", "div");
            }
        });

    };

    // 查询用户阅读宝提现额度
    function queryQuota() {
        // 查询用户本月直推人数
        $.ajax({
            url: website + '/UserController/queryDirectPush',
            type: 'post',
            data: {userId: userId},
            success: function (data) {
                $("#withdrawalLimit").html(data.data);
            }, error: function () {
                mui.showLoading("发生错误,返回首页..", "div");
                mui.openWindow({
                    url: "http://newst.whilte.com/index.html",
                });
            }
        });

    };

    mui('header').on('tap', '.backahter', function (e) {
        mui.openWindow({
            url: 'task.html'
        });
    });
    mui('header').on('tap', '#headers', function (e) {
        mui.openWindow({
            url: 'shop-distributions.html'
        });
    });

    window.onload = function () {
        mui.hideLoading();
    }
</script>
<script type="text/javascript">
    // 吸顶状态
    var obj = document.getElementById("sliderSegmentedControl");
    var ot = obj.offsetTop;
    document.onscroll = function () {
        var st = document.body.scrollTop || document.documentElement.scrollTop;
        obj.setAttribute("data-fixed", st >= ot ? "fixed" : "")
    }
</script>

</html>
